<template>
  <div>
    <div v-if="mode===0">
      <el-button type="primary" plain @click="sheet">Daily Sheet</el-button>
      <el-button type="primary" plain @click="count">Statistics</el-button>
      <!--<el-button type="primary" plain>Search</el-button>-->
    </div>
    <div v-else-if="mode===1">
      <!--<el-button type="primary" plain @click="addbranchVisible=true">Add Branch</el-button>-->
      <!--<el-button type="primary" plain>Search</el-button>-->
    </div>
    <div v-else-if="mode===2">
      <!--<el-button type="primary" plain>Add Material</el-button>-->
      <!--<el-button type="primary" plain>Search</el-button>-->
    </div>
    <div v-else-if="mode===3">
      <!--<el-button type="primary" plain @click="adduser('manager')">Add Manager</el-button>-->
      <!--<el-button type="primary" plain @click="adduser('user')">Add User</el-button>-->
      <!--<el-button type="primary" plain>Search</el-button>-->
    </div>
    <!--增加用户-->
    <el-dialog
      :title="'Add '+userInfo.type"
      :visible.sync="dialogVisible"
      width="50%"
    >
      <el-row justify="center" type="flex">
        <el-col :span="16">
          <div>
            Username:
            <el-input
              v-model="userInfo.telephone"
            >
            </el-input>
          </div>
          <div>
            Password:
            <el-input
              v-model="userInfo.password"
            >
            </el-input>
          </div>
          <div>
            Telephone:
            <el-input
              v-model="userInfo.telephone"
            >
            </el-input>
          </div>
          <div>
            Name:
            <el-input
              v-model="userInfo.username"
            >
            </el-input>
          </div>
          <p>Address:</p>
        </el-col>
      </el-row>
      <el-row type="flex" justify="center" align="center">

        <el-col :span="16">
          <div>

            <el-select v-model="add1" placeholder="请选择">
              <el-option
                v-for="(item,i) in Addr1"
                :key="i"
                :label="item"
                :value="i">
              </el-option>
            </el-select>
            <el-select v-model="userInfo.add2" placeholder="请选择">
              <el-option
                v-for="(item,i) in Addr2"
                :key="i"
                :label="item.name"
                :value="i">
              </el-option>
            </el-select>
            <el-select v-if="!userInfo.add2" placeholder="请选择">
            </el-select>
            <el-select v-else="userInfo.add2" v-model="add3" placeholder="请选择">
              <el-option
                v-for="(item,i) in Addr2[userInfo.add2].list"
                :key="i"
                :label="item"
                :value="i">
              </el-option>
            </el-select>
            <el-input
              v-model="userInfo.addr3"
            >
            </el-input>
          </div>
        </el-col>


      </el-row>
      <span slot="footer" class="dialog-footer">
    <el-button type="primary" @click="dialogVisible = false">Confirm</el-button>
  </span>
    </el-dialog>
    <!--增加分店-->
    <el-dialog
      title="Add Branch"
      :visible.sync="addbranchVisible"
      width="50%"
    >
      <el-row justify="center" type="flex">
        <el-col :span="16">
          <div>
            Manager Id:
            <el-input
              v-model="branchInfo.manager_id"
            >
            </el-input>
          </div>
          <div>
            Manager Telephone:
            <el-input
              v-model="branchInfo.manager_telephone"
            >
            </el-input>
          </div>

          <p>Address:</p>
        </el-col>
      </el-row>
      <el-row type="flex" justify="center" align="center">

        <el-col :span="16">
          <div>

            <el-select v-model="add1" placeholder="请选择">
              <el-option
                v-for="(item,i) in Addr1"
                :key="i"
                :label="item"
                :value="i">
              </el-option>
            </el-select>
            <el-select v-model="branchInfo.add2" placeholder="请选择">
              <el-option
                v-for="(item,i) in Addr2"
                :key="i"
                :label="item.name"
                :value="i">
              </el-option>
            </el-select>
            <el-select v-if="!branchInfo.add2" placeholder="请选择">
            </el-select>
            <el-select v-else="branchInfo.add2" v-model="add3" placeholder="请选择">
              <el-option
                v-for="(item,i) in Addr2[branchInfo.add2].list"
                :key="i"
                :label="item"
                :value="i">
              </el-option>
            </el-select>
            <el-input
              v-model="userInfo.addr3"
            >
            </el-input>
          </div>
        </el-col>


      </el-row>
      <span slot="footer" class="dialog-footer">
    <el-button type="primary" @click="addbranchVisible = false">Confirm</el-button>
  </span>
    </el-dialog>
    <!--统计日活-->
    <el-dialog
      title="Statistics"
      :visible.sync="countVisible"
      width="50%"
    >
      <el-row justify="center" type="flex">
        <template>
          <el-table
            :data="tableData"
            style="width: 90%">
            <el-table-column
              prop="order"
              label="今日订单"
            >
            </el-table-column>
            <el-table-column
              prop="success"
              label="今日成交"
             >
            </el-table-column>
            <el-table-column
              prop="user"
              label="今日用户"
            >
            </el-table-column>
            <el-table-column
              prop="income"
              label="今日收入"
            >
            </el-table-column>
          </el-table>
        </template>
      </el-row>
      <span slot="footer" class="dialog-footer">
    <el-button type="primary" @click="countVisible = false">Confirm</el-button>
  </span>
    </el-dialog>

  </div>

</template>

<script>
  export default {
    name: "GDFunctionSuButtons",
    props: ["mode"],
    data() {
      return {
        dialogVisible: false,
        addbranchVisible: false,
        countVisible:false,

        userInfo: {},
        branchInfo: {},
        add1: 0,
        Addr1: [],
        Addr2: [],
        tableData: [
          (()=>{
            const list=this.api.orderList;
            const date=new Date().toLocaleDateString();
            let order=0,success=0,income=0,user=new Set();
            for (const listElement of list) {
              const itemDate=new Date(listElement.date).toLocaleDateString();
              if(itemDate===date){
                order++;
                if(listElement.status==='success'){
                  success++;
                  income+=parseInt(listElement.price.substr(1));
                }
                user.add(listElement.tUser);
              }
            }
            return{
              order:order,
              success:success,
              user:user.size,
              income:'￥'+income
            }
          })(),
        ],
      }
    },
    methods: {
      adduser(type) {
        this.dialogVisible = true;
        this.userInfo.type = type;
      },
      sheet() {
        window.open("#/printer", "newwindow", "height=900, width=800, top=0, left=0, toolbar=no, menubar=no, scrollbars=no, resizable=yes,location=no, status=no");
      },
      count(){
        this.countVisible=true;
      },

    },
    created() {
      this.Addr1 = this.api.address1;
      this.Addr2 = this.api.address2;
    },

  }
</script>
<style>
  .el-select .el-input {
    width: 120px;
  }
</style>
<style scoped>

</style>
